import request from "../../utils/request";
Page({

  /**
   * 页面的初始数据
   */
  data: {
    placeholderContent: '', // placeholder 的内容
    hotList: [], // 热搜榜数据
    searchInputContent: '', // 用户在 input 框中输入的数据
    searchList: [], // 关键字模糊匹配的数据
    historyList: [],  // 历史搜索记录数组
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 获取搜索框初始化数据
    this.getInitData();
  },

  // 获取搜索框初始化数据
  async getInitData() {
    let placeholderData = await request('search/default');
    let hotListData = await request('search/hot/detail');
    this.placeholderContent = placeholderData.data.showKeyword
    this.setData({
      placeholderContent: this.placeholderContent,
      hotList: hotListData.data
    })
  },

  // input 框失去焦点的回调
  handleOnfocus() {
    this.setData({
      placeholderContent: ''
    })
  },
  // input 框获得焦点的回调
  handleOnblur(event) {
    if (event.detail.value.trim()) {
      return;
    }
    this.setData({
      placeholderContent: this.placeholderContent
    })
  },

  // input 框的内容发生改变的回调
  handleInputChange(event) {
    this.setData({
      searchInputContent: event.detail.value.trim()
    });

    // 防抖
    clearTimeout(this.TimeId);
    this.TimeId = setTimeout(async () => {
      // 如果输入框为空，则不发送请求
      if (!this.data.searchInputContent) {
        this.setData({
          searchList: []
        })
        return;
      }
      // 发请求获取关键字模糊匹配数据
      let searchListData = await request('search',
        {keywords: this.data.searchInputContent, limit: 10});
      this.setData({
        searchList: searchListData.result.songs
      })

      // 将搜索的关键字添加到历史搜索记录中
      this.addSearchRecord();
    }, 200);
  },

  // 将搜索的关键字添加到历史搜索记录中
  addSearchRecord() {
    let {searchInputContent, historyList} = this.data;
    let searchIndex = historyList.indexOf(searchInputContent);
    if (searchIndex !== -1) {
      // 去除数组中的该关键字（加到后面）
      historyList.splice(searchIndex, 1);
    }
    historyList.unshift(searchInputContent);
    this.setData({
      historyList
    })
    wx.setStorageSync('searchHistory', historyList);
  },

  // 获取本地历史搜索记录的功能函数
  getSearchHistory() {
    let historyList = wx.getStorageSync('searchHistory');
    if (historyList) {
      this.setData({
        historyList
      });
    }
  },

  // 清空搜索内容
  clearSearchContent() {
    console.log('clearSearchContent');
    this.setData({
      searchInputContent: '',
      searchList: []
    })
  },

  // 删除历史搜索记录
  deleteSearchHistory() {
    wx.showModal({
      content: '确认删除吗？',
      success: res => {
        // 若点击了确认，则返回的 res.confirm 的值为true
        if (res.confirm) {
          // 清空 data 中的 historyList数组中的所有数据
          this.setData({
            historyList: []
          });
          // 移除本地的历史记录缓存
          wx.removeStorageSync('searchHistory');
        }
      }
    })
  },


  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})
